<template>
  <el-icon class="collapse-icon" @click="changeColl">
    <component :is="themeConfig.isCollapse ? 'expand' : 'fold'"></component>
  </el-icon>
</template>

<script lang="ts" setup>
import { computed } from "vue";
import { GlobalStore } from "@/stores";

const globalStore = GlobalStore();
const themeConfig = computed(() => globalStore.themeConfig);

const changeColl = () => {
  console.log("------------")
  globalStore.setThemeConfig({
    ...themeConfig.value,
    isCollapse: !themeConfig.value.isCollapse,
  });
};
</script>
<style lang="scss" scoped>
.el-icon svg {
  height: 1.5em !important;
  width: 1.5em !important;
}
</style>
